<template>
	<view>
		<view class="card">
			<image src="/static/card/card_hand.png" mode="widthFix"></image>
			<view class="zi f30 color3 tc fbox fbox-jcenter fbox-column">
				<text>Currently you don't have My MUSE e-Card yet! </text>
				<text>Please create your own exclusive e-Card first!</text>
			</view>
			<view class="two-btn f30">
				<view class="btn1" @click="goToCreate">
					Create My MUSE e-Card
				</view>
				<view class="btn2" @click="goToCheck">
					Check My MUSE e-Card Collection
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		methods: {
			goToCreate() {
				uni.navigateTo({
					url: '/pages/user/card/edit?isshow=true'
				})
			},
			goToCheck() {
				uni.navigateTo({
					url: '/pages/user/card/list'
				})
			},

		}
	}
</script>

<style lang="scss">
	page {
		background-color: #FFFFFF;
	}

	.top {
		margin: 30rpx;

		image {
			width: 100%;
			height: 165rpx;
			border-radius: 30rpx;
		}
	}

	.card {
		image {
			width: 300rpx;
			margin: 70rpx auto;
			display: block;
		}

		.zi {}

		.two-btn {
			margin-top: 100rpx;

			view {
				width: 80%;
				padding: 30rpx 0;
				border-radius: 50rpx;
				text-align: center;
				margin: 30rpx auto 0;
			}

			.btn1 {
				background-color: #3cc9fe;
				color: #FFFFFF;
			}

			.btn2 {
				background-color: #FFFFFF;
				color: #3cc9fe;
				box-shadow: 0 0 10rpx 2rpx #ededed;
			}
		}
	}
</style>
